// store.ts
import { InjectionKey } from "vue";
import { createStore, useStore as baseUseStore, Store } from "vuex";
import { ITab } from "./type";

export interface State {
  count: number;
  collapse: boolean;
  itabList: Array<ITab>;
}

export const key: InjectionKey<Store<State>> = Symbol();

export const store = createStore<State>({
  state: {
    count: 0,
    collapse: false,
    itabList: [],
  },
  mutations: {
    setCount(state: State, count: number) {
      state.count = count;
    },
    setCollapse(state: State, collapse: boolean) {
      state.collapse = collapse;
    },
    addItab(state: State, tab: ITab) {
      if (state.itabList.some((item) => item.path === tab.path)) return;
      state.itabList.push(tab);
    },
    setItab(state: State, newTabs: Array<ITab>) {
      state.itabList = newTabs;
    },
  },
  getters: {
    getCount(state: State) {
      return state.count;
    },
    getCollapse(state: State) {
      return state.collapse;
    },
    getTabs(state: State) {
      return state.itabList;
    },
  },
});

// 定义自己的 `useStore` 组合式函数
export function useStore() {
  return baseUseStore(key);
}
